Pop-overs that appear on keyboard focus can be dismissed using the keyboard

Design Notes

Design decisions are not relevant.

Developer Notes

Ensure overlays that are activated with a keyboard can be dismissed using the keyboard

Additional content should not interfere with viewing or operating original content on the page.

Where additional content that appears and disappears when activated via pointer hover or keyboard, the interaction should be designed in a way that users can perceive the additional content and dismiss it without disrupting their current page journey.

Ensure that any content that appears when an element receives focus

  • remains visible whilst the element has focus
  • can be dismissed with moving focus (for example using the ESC key)

Testing Notes

Overlays that are activated with the keyboard can be dismissed using the keyboard

Steps to check

  • use the keyboard Tab key to progress through interactive page elements and identify any instance of additional content (overlays) that appears on focus that has been implemented by a developer (ie not the browsers default behaviour) and hides content in the page
  • does the additional content remain visible until the focus is moved?
  • can the additional content be dismissed without moving keyboard focus (for example, with the ESC key)?

Impact range: Medium

Test type: Manual

WCAG Reference: Understanding Success Criterion 1.4.13 Content on Hover or Focus